.chat-box{
    display: -webkit-flex;
    display: flex;
    flex-direction: column;
    .chat-header{
        height: 53px;
        line-height: 53px;
        font-size: 12px;
        border-bottom: 1px solid #E8E8E8;
        padding: 0 10px;
        .chat-header-left{
            width: 80%;
            float: left;
            .chat-header-name{
                font-size: 15px;
                color: #495060;
                font-weight: 700;
            }
        }
    }
    .container-main{
        flex: 1;
        padding: 10px;
        overflow-x: hidden;
        overflow-y: auto;
        &::-webkit-scrollbar{
            width: 4px;
        }
        .message-block{
            .message-time{
                font-size: 12px;
                color: rgba(73,80,96,0.60);
                text-align: center;
            }
            .message-main{
                margin: 12px 0;
                .message-img{
                    position: relative;
                    display: inline-block;
                    padding: 4px 10px;
                    margin: 0 8px;
                    img{
                        vertical-align: top;
                        max-width: 200px;
                    }
                }
                .message-content {
                    vertical-align: middle;
                    max-width: calc(~"100% - 100px");
                    background-color: #F5F5F5;
                    position: relative;
                    display: inline-block;
                    font-size: 15px;
                    color: #353535;
                    border-radius: 14px;
                    padding: 6px 10px;
                    margin: 0 8px;
                    text-align: left;
                    word-wrap: break-word;
                }
            }
            .self {
                text-align: right;
                .ivu-avatar{
                    float: right;
                }
                .message-content {
                    background: #0084FF;
                    color: #fff;
                }
            }
        }
    }
    .chat-footer{
        bottom: 0;
        left: 0;
        right: 0;
        padding: 10px;
        border-top: 1px solid #E8E8E8;
        .input-box{
            .ivu-input{
                border: none;
                box-shadow: none;
                -webkit-box-shadow: none;
                padding: 0;
                margin-bottom: 10px;
            }
            .ivu-btn{
                border: 1px solid #979797;
                border-radius: 4px;
                color: #495060;
            }
            .ivu-btn[disabled]{
                color: #ABABAB;
                background-color: #fff;
                border: 1px solid #DBDEE1;
            }
            .input-box-footer-left{
                display: inline-block;
                width: 50%;
            }
            .input-box-footer-right{
                display: inline-block;
                width: 50%;
                text-align: right;
            }
        }
    }
}